// pages/read/read.js

    // 初始化签名变量，放在 Page 前
    var content = null;
    var touchs = [];
   // 在页面中定义插屏广告
   let interstitialAd = null

Page({

  /**
   * 页面的初始数据
   */
  data: {

    imgList:[],
    signImage: '',

    widthV : 1,

    colorV : 1
  },

 

  // 画布的触摸移动开始手势响应
  start: function (event) {
    // console.log("触摸开始" + event.changedTouches[0].x);
    // console.log("触摸开始" + event.changedTouches[0].y);
    //获取触摸开始的 x,y
    let point = { x: event.changedTouches[0].x, y: event.changedTouches[0].y }
    touchs.push(point);
  },
  // 画布的触摸移动手势响应
  move: function (e) {
    let point = { x: e.touches[0].x, y: e.touches[0].y }
    touchs.push(point);
    if (touchs.length >= 2) {
      this.draw(touchs);
    }
  },
  // 画布的触摸移动结束手势响应
  end: function (e) {
    console.log("触摸结束" + e);
    //清空轨迹数组
    for (let i = 0; i < touchs.length; i++) {
      touchs.pop();
    }
  },
  // 画布的触摸取消响应
  cancel: function (e) {
    console.log("触摸取消" + e);
  },
  // 画布的长按手势响应
  tap: function (e) {
    console.log("长按手势" + e);
  },
  error: function (e) {
    console.log("画布触摸错误" + e);
  },

  onChangeWidth(e){
    let id = e.currentTarget.dataset.width;
    content.setLineWidth(id * 3)
     this.setData({

      widthV : id
     })
  },

  onSetbackground(e){

    content.fillStyle="#FFFFFF";
    ctx.fillRect(0,0,c.width,c.height);
  },
  onChangeColor(e){
    let id = e.currentTarget.dataset.width;

  let colors = ['#000','#FFCE54','#8cc152',
  '#3bafda','#5e9cec','#D770ad','#DA4453']
    content.setStrokeStyle(colors[id-1])

   this.setData({

    colorV : id
   })
  },



  /**
  * 生命周期函数--监听页面加载
  */
  onLoad: function (options) {
    //获得Canvas的上下文
    content = wx.createCanvasContext('sign');
    //设置线的颜色
    content.setStrokeStyle("#000");
    //设置线的宽度
    content.setLineWidth(10);
    //设置线两端端点样式更加圆润
    content.setLineCap('round');
    //设置两条线连接处更加圆润
    content.setLineJoin('round');

        // 在页面onLoad回调事件中创建插屏广告实例
 if (wx.createInterstitialAd) {
  interstitialAd = wx.createInterstitialAd({
    adUnitId: 'adunit-4f7248da1ca9379d'
  })
  interstitialAd.onLoad(() => {})
  interstitialAd.onError((err) => {})
  interstitialAd.onClose(() => {})
 }
  },
  //绘制
  draw: function (touchs) {
    let point1 = touchs[0];
    let point2 = touchs[1];
    touchs.shift();
    content.moveTo(point1.x, point1.y);
    content.lineTo(point2.x, point2.y);
    content.stroke();
    content.draw(true);
  },
  //清除操作
  clearClick: function () {
    //清除画布
    content.clearRect(0, 0,750, 700);
    content.draw(true);
  },
  //保存图片
  saveClick: function () {
    var that = this;
    console.log('saveClick');
    wx.canvasToTempFilePath({
      canvasId: 'sign',
      success: function (res) {
        //打印图片路径
        console.log(res.tempFilePath);
        //设置保存的图片
        that.setData({
          signImage: res.tempFilePath
        })
        that.clearClick()

        wx.saveImageToPhotosAlbum({
          filePath: that.data.signImage,
          success(res) {
            wx.showToast({
              title: '保存成功',
              icon: 'success',
              duration: 1500
            })
            s
          }
        })

        // that.urlTobase64(res.tempFilePath)
      },
      error(res){

        console.log(res);
      }
    })
  },



    urlTobase64(url){

      let that = this;

      wx.request({
        url:url,
        responseType: 'arraybuffer', //最关键的参数，设置返回的数据格式为arraybuffer
        success:res=>{
          //把arraybuffer转成base64
              let base64 = wx.arrayBufferToBase64(res.data); 
              
              //不加上这串字符，在页面无法显示的哦
              base64　= 'data:image/jpeg;base64,' + base64　
              
              //打印出base64字符串，可复制到网页校验一下是否是你选择的原图片呢
              console.log(base64)　
              that.onPicToMac(base64)
            }
      })
   },
  


  onPicToMac(base64 ){

    let that = this;
    wx.serviceMarket.invokeService({
      service: 'wx79ac3de8be320b71', // '固定为服务商OCR的appid，非小程序appid',
      api: 'OcrAllInOne',
      data: {
        img_data: base64,
        data_type: 2,
        ocr_type: 8,
      },
    }).then(res => {
      console.log('invokeService success', res)
      wx.showModal({
        title: 'cost',
        content: (Date.now() - d) + '',
      })
    }).catch(err => {
      console.error('invokeService fail', err)
      wx.showModal({
        title: 'fail',
        content: err + '',
      })
    })
  },
  
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

    // 在适合的场景显示插屏广告
if (interstitialAd) {
  interstitialAd.show().catch((err) => {
    console.error(err)
  })
}
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})